<template>
	<div class="root">
		<div class="login">
			<div class="title">欢迎访问电商管理系统</div>
			<div class="btn" @click="login">登录</div>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				
			}
		},
		methods:{
			login(){
				//编程方式路由跳转  字符串形式
				//this.$router.push("main")
				
				//编程方式路由跳转  函数形式
				//this.$router.push({path:"/main"})
				this.$router.push({name:"main"})
			}
		}
	}
</script>

<style scoped="scoped">
	.root{
		background-color: #f1f2f3;
		width: auto;
		height: 100%;
		border: 1px solid #f1f2f3;
	}
	.login{
		width: 500px;
		height: 300px;
		background-color: #fff;
		margin: auto;
		margin-top: 100px;
		border-radius: 15px;
	}
	.title{
		height: 60px;
		line-height: 60px;
		font-size: 20px;
		font-weight: bold;
	}
	.btn{
		width: 200px;
		height: 25px;
		line-height: 25px;
		background-color: #FF0000;
		color: #fff;
		text-align: center;
		margin: auto;
		border-radius: 15px;
		cursor: pointer;
		margin-top: 200px;
	}

</style>